<template>
  <el-container style="height:100%">
    <el-row class="padding_top_10" type="flex" align="middle">
      <el-col :span="5">
        <el-input
          placeholder="请输入搜索内容"
          prefix-icon="el-icon-search"
          v-model="txtsearch"
          clearable
        ></el-input>
      </el-col>
      <el-col :span="19" class="align-right"> </el-col>
    </el-row>
    <el-main class="el-main_padding1">
      <el-table
        ref="table"
        v-loading="loading"
        border
        :data="tableData"
        stripe
        row-key="System_16_10"
        height="100%"
      >
        <el-table-column type="selection" width="40"> </el-table-column>
        <el-table-column type="index" width="40"> </el-table-column>
        <el-table-column prop="System_16_20" label="登录名"> </el-table-column>
        <el-table-column prop="System_16_30" label="姓名"> </el-table-column>
        <!-- <el-table-column prop="str40" label="操作类别"> </el-table-column> -->
        <el-table-column prop="System_16_70" label="操作提示">
        </el-table-column>
        <el-table-column prop="System_16_90" label="日志描述">
        </el-table-column>
        <el-table-column prop="System_16_50" label="功能模块">
        </el-table-column>
        <!-- <el-table-column prop="System_16_60" label="页面地址">
        </el-table-column> -->
        <el-table-column prop="System_16_80" width="180px" label="记录时间">
        </el-table-column>
        <el-table-column prop="System_16_100" label="操作人角色">
        </el-table-column>
        <el-table-column prop="System_16_110" label="操作人部门">
        </el-table-column>
        <!-- <el-table-column prop="System_16_120" label="操作IP"> </el-table-column>
        <el-table-column prop="System_16_130" label="操作机器物理地址"> 
        </el-table-column>-->
      </el-table>
    </el-main>
    <el-footer class="main-footer ">
      <mei-pagination :pageTotal="sys16Data.length" v-model="paginations">
      </mei-pagination>
    </el-footer>
  </el-container>
</template>

<script>
import { System16 } from "@/api";
export default {
  data() {
    return {
      loading: false,
      txtsearch: "",
      sys16Data: [],
      paginations: {}
    };
  },
  //外部属性
  props: {},
  //内部方法
  methods: {
    async initPage() {
      const loading = this.$loading({
        target: this.$refs.table.$el,
        lock: true,
        text: "加载中..."
      });
      this.sys16Data = await System16.get(this.txtsearch);
      this.$nextTick(() => {
        loading.close();
      });
    }
  },
  //组件
  components: {},
  //初始化 异步加async await
  mounted() {
    this.initPage();
  },
  //计算属性
  computed: {
    //内存分页
    tableData() {
      let _data = this.sys16Data;
      const { index = 1, size = 10 } = this.paginations;
      _data = this.sys16Data.slice((index - 1) * size, size * index);
      return _data;
    }
  },
  //监视
  watch: {
    txtsearch() {
      this.initPage();
    }
  }
};
</script>

<style></style>
